<template>
	<view>
		<cu-custom :isBack="true">
			<block slot="backText">
				{{linkageName ? linkageName : deviceName  }}
			</block>
		</cu-custom>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" :up="upOption"
			@up="pageGetLinkageExecute">
			<view v-for="(arrItem,arrIndex) in executeList" :key="arrIndex">
				<view v-for="(item,index) in arrItem" :key="index"
					class="bg-white padding-sm margin-sm flex justify-between align-center common-box">
					<view v-if="item.type === 't'" class=" flex align-center">
						<view class="margin-sm cuIcon-countdown" style="font-size: 60rpx;"></view>
						<view>
							<view class="text-bold text-sm">{{$t('timer')}}</view>
							<view class="text-gray margin-top-xs  text-sm">{{item.timer}}</view>
							<view class="margin-top-xs text-sm">{{ formatDate(item.createdDate)}}</view>
						</view>
					</view>
					<view v-else-if="item.type === 't2'" class=" flex align-center">
						<view class="margin-sm cuIcon-countdown" style="font-size: 60rpx;"></view>
						<view>
							<view class="text-bold text-sm">{{$t('timeSlot')}}</view>
							<view class="text-gray margin-top-xs text-sm">{{item.timer}}</view>
							<view class="margin-top-xs text-sm">{{formatDate(item.createdDate)}}</view>
						</view>
					</view>
					<view v-else-if="item.type === 'i'" class=" flex align-center">
						<view class="margin-sm cuIcon-countdown" style="font-size: 60rpx;"></view>
						<view>
							<view class="text-bold text-sm">{{$t('interval')}}</view>
							<view class="text-gray margin-top-xs text-sm">{{item.timer}}</view>
							<view class="margin-top-xs text-sm">{{formatDate(item.createdDate)}}</view>
						</view>
					</view>
					<view v-else-if="item.type === 's'" class=" flex align-center">
						<image :src="item.iconUrl" style="width: 60rpx;height: 60rpx;" class="margin-sm"></image>
						<view>
							<view class="text-sm">
								<text
									class="text-bold margin-right-sm">{{formatSensorType(item.sensorType)}}{{$t('port')}}:{{item.port}}</text>
								<text v-if="item.sensorName">[ {{item.sensorName}} ]</text>
							</view>
							<view class="text-gray margin-top-xs text-sm">
								<text>{{ item.name }}</text>
								<text class="margin-left-xs">
									{{ formatterLogic(item.logic) }}
								</text>
								<text class="margin-left-xs">{{item.value}}</text>
							</view>
							<!-- <view class="margin-left-xs">{{item.triggerValue}}</view> -->
							<view class="margin-top-xs">{{formatDate(item.createdDate)}}</view>
						</view>
					</view>
					<view v-else>未知</view>
					<view>
						<view class="margin-left-xs">{{formatStatus(item.status)}}</view>
					</view>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import {formatDateTime} from '@/util/formatTime.js'
	import * as deviceSensorApi from '@/api/iot/iotDeviceSensorApi.js'
	import * as deviceLinkageExecuteApi
	from '@/api/iot/iotDeviceLinkageExecuteApi.js'
	import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins.js';
	import {
		formatSensorType
	} from '@/util/dataUtil.js'
	export default {
		mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件)
		name: 'DeviceLinkageExecute',
		data() {
			return {
				style: '',
				downOption: {
					use: true,
					auto: false //是否在初始化后,自动执行downCallback; 默认true
				},
				upOption: {
					auto: false,
					empty: {
						use: true,
						fixed: true,
						top: '20%'
					},
				},
				deviceCore: null,
				deviceName: null,
				linkageId: null,
				linkageName: null,
				executeList: [],
				currentPage: 1,
				pageSize: 10,
				sensorWithExplainList: [],
				logicList: [],
				statusList: []
			}
		},
		computed: {
			themeConfig() {
				return this.$store.state.themeConfig
			}
		},
		onLoad(option) {
			this.initOption = option
			this.init()
		},
		created() {
			this.logicList = [{
					label: this.$t('greater'),
					value: '>'
				},
				{
					label: this.$t('equal'),
					value: '='
				},
				{
					label: this.$t('less'),
					value: '<'
				},
			]
			this.statusList = [{
					label: this.$t('done'),
					value: 'done'
				},
				{
					label: this.$t('ing'),
					value: 'ing'
				},
				{
					label: this.$t('error'),
					value: 'error'
				},
				{
					label: this.$t('reset'),
					value: 'reset'
				},
			]
		},
		methods: {
			formatSensorType(type) {
				return formatSensorType(this, type)
			},
			formatDate(date) {
				if (date === 0) {
					return ''
				}
				return formatDateTime(date)
			},
			formatStatus(status) {
				for (const item of this.statusList) {
					if (item.value === status) {
						return item.label
					}
				}
			},
			formatterLogic(logic) {
				for (const item of this.logicList) {
					if (item.value === logic) {
						return item.label
					}
				}
			},
			listSensorWithExplain() {
				deviceSensorApi.listSensorWith({
					deviceCore: this.deviceCore,
					withExplain: true
				}).then(res => {
					const {
						data
					} = res
					if (data) {
						this.sensorWithExplainList = data
					} else {
						this.sensorWithExplainList = []
					}
					this.pageGetLinkageExecute()
				})
			},
			downCallback() {
				this.currentPage = 1
				this.executeList = []
				this.mescroll.resetUpScroll()
			},
			init() {
				this.linkageId = this.initOption.linkageId || null
				this.deviceCore = this.initOption.deviceCore || null
				this.deviceName = this.initOption.deviceName || ''
				this.linkageName = this.initOption.linkageName || null
				this.listSensorWithExplain()
			},
			pageGetLinkageExecute() {
				deviceLinkageExecuteApi.pageGetLinkageExecute({
					currentPage: this.currentPage,
					pageSize: this.pageSize,
					linkageId: this.linkageId,
					deviceCore: this.deviceCore
				}).then(res => {
					if (res.data) {
						let {
							currentPage,
							data,
							total
						} = res.data
						for (const item of data) {
							if (item.type === 's') {
								for (const sensor of this.sensorWithExplainList) {
									if (sensor.port === item.port) {
										for (const explain of sensor.explainList) {
											if (item.keyName === explain.keyName) {
												item.name = explain.name
												item.iconUrl = explain.iconUrl
												item.sensorName = sensor.sensorName
												item.sensorType = sensor.type
												break
											}
										}
										break
									}
								}
							}
						}
						this.mescroll.endByPage(data.length, total)
						let index = currentPage - 1
						this.$set(this.executeList, index, data)
						this.currentPage = currentPage + 1
					}
				})
			}
		},

	}
</script>

<style>
</style>
